<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="/static/css/bootstrap.min.css">
    <title>Document</title>
</head>
<body>
    <div class="container-fluid"style="width:80%">
        <div style="margin-bottom:15px;"class=clearfix>
            <a href="/purify_add"class='btn btn-primary'>
                <span class="glyphicon glyphicon-plus-sign">添加</span>
            </a>
            <input style="float:right;"id="btnAdd"type="button"class="btn btn-primary" value="导出进货订单">
        </div>
       
            
      
       
        <div class="panel panel-default">
            <div class="panel-heading">纯净水列表</div>
            <div class="panel-body">
                <table class="table table-bordered table-hover">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>类别</th>
                        <th>单价</th>
                        <th>库存量</th>
                        
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    {% for obj in queryset%}
                    <tr>
                        <td>{{obj.id}}</td>
                        <td>{{obj.pname}}</td>
                        <td>{{obj.price}}</td>
                        <td>{{obj.num}}</td>
                        
                       
                        <td>
                            <a href="/purify_edit/{{obj.id}}/"class='btn btn-primary btn-xs'>编辑</a>
                            <a href="/purify_delete/{{obj.id}}/"class='btn btn-danger btn-xs'>删除</a>
                        </td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
            </div>
          </div>
          
          <div class="clearfix"></div>
        <ul class="pagination"style="float:right">
            {{page_string}}
         </ul>
    </div>
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
              <h4 class="modal-title" id="myModalLabel">取货信息</h4>
            </div>
            <div class="modal-body">
                <table class="table table-bordered">
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>纯净水</th>
                            <th>缺货数量</th>
                            
                        </tr>
                    </thead>
                    <tbody>
                        {% for obj in queryset2 %}
                        <tr>
                            <td>{{obj.id}}</td>
                            <td>{{obj.pname}}</td>
                            <td>{{obj.num}}</td>
                               
                        </tr>
                        {%endfor%}
                    </tbody>
                </table>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
             
            </div>
          </div>
        </div>
    </div>

    <script src="/static/js/jquery-3.6.0.min.js"></script>  
    <script src="/static/js/bootstrap.min.js"></script> 
    <script src="/static/js/echarts.min.js"></script> 

    <script>
        var currentId;
        $(function(){
            bindBtnEvent();
            bindBtn2Evnet();
    
        })
        function bindBtnEvent(){   
            $('#btnAdd').click(function(){
                 $('#myModal').modal('show');
            })       
            
                        
             
        }
        function bindBtn2Evnet(){
            $("#btnConfirm").click(function(){
    
                $.ajax({
                    url:'/order_detail/',
                    type:'get',
                    data:{
                        status:currentId,
                    },
                    dataType:"JSON",
                })
            })
        }
    </script>
   
</body>
</html>